<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<div class="main-content">
    <div class="box box-main">
        <form id="inputForm" model="post" action="<c:url value="/web/admin/application/addOrUpdate.action"/>"
              method="post" enctype="multipart/form-data" class="form-horizontal">
            <div class="box-body">
                <div class="form-unit">基本信息</div>
                <input name="id" value="${application.id}" type="hidden">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required ">*</span> 名称：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input path="postCode111" name="applicationName" value="${application.applicationName}"
                                       maxlength="64" class="form-control required"/>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required ">*</span> 类型：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <%--<input path="postCode111" maxlength="64" name="url" value="${application.url}"  class="form-control required"/>--%>
                                <select name="type" id="applicationType" class="form-control required">
                                    <option value="INNER">内部跳转</option>
                                    <option value="APP">APP跳转</option>
                                    <option value="OUT">外部跳转</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required ">*</span> 跳转地址：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input path="postCode111" maxlength="64" name="url" value="${application.url}"
                                       class="form-control required"/>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required ">*</span> 图标：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input path="postCode111" maxlength="64" id="doc" name="file" type="file"
                                       onchange="javascript:setImagePreview();"/>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                预览：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">

                                <div id="localImag"><img id="preview" src="<c:if test="${application.icon!=null}"> ${application.icon}</c:if>" width="50" height="50"
                                                         style="display: block; width: 50px; height: 50px;"></div>
                            </div>

                        </div>
                    </div>

                </div>

            </div>
            <input id="typeValue" value="${type}" type="hidden">
            <div class="box-footer">
                <div class="row">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-sm btn-primary" id="btnSubmit"><i class="fa fa-check"></i>
                            保 存
                        </button>&nbsp;

                        <button type="button" class="btn btn-sm btn-default" id="btnCancel" onclick="closeView()"><i
                                class="fa fa-times"></i> 关 闭
                        </button>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    if($("#typeValue").val()=="APP"){
        $("#applicationType").val("APP");
    }else if($("#typeValue").val()=="INNER"){
        $("#applicationType").val("INNER");
    }else {
        $("#applicationType").val("OUT");
    }


    $("#inputForm").validate({
        submitHandler: function (form) {
            js.ajaxSubmitForm($(form), function (data) {
                // console.log(data);
                js.showMessage(data.msg);
                if (data.status == Global.NO) {
                    closeView();
                    $('#dataGrid').dataGrid("refresh");
                }
            }, "json");
        }
    });

    function closeView() {
        layer.close(LayWin['wApplication']);
    }


    function setImagePreview(avalue) {
        var docObj = document.getElementById("doc");
        var imgObjPreview = document.getElementById("preview");
        if (docObj.files && docObj.files[0]) {
            //火狐下，直接设img属性
            imgObjPreview.style.display = 'block';
            imgObjPreview.style.width = '50px';
            imgObjPreview.style.height = '50px';
            //imgObjPreview.src = docObj.files[0].getAsDataURL();
            //火狐7以上版本不能用上面的getAsDataURL()方式获取，需要一下方式
            imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
        }
        else {
            //IE下，使用滤镜
            docObj.select();
            var imgSrc = document.selection.createRange().text;
            var localImagId = document.getElementById("localImag"); //必须设置初始大小
            localImagId.style.width = "50px";
            localImagId.style.height = "50px"; //图片异常的捕捉，防止用户修改后缀来伪造图片
            try {
                localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
                localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
            } catch (e) {
                alert("您上传的图片格式不正确，请重新选择!");
                return false;
            }
            imgObjPreview.style.display = 'none';
            document.selection.empty();
        }
        return true;
    }

</script>


